﻿<%@ Page Language="C#" AutoEventWireup="true" CodeFile="Index.aspx.cs" Inherits="Index" %>

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
    <title>Herborist</title>
    <script src="jquery-easyui-1.2.6/jquery-1.7.2.min.js" type="text/javascript"></script>
    <script src="jquery-easyui-1.2.6/jquery.easyui.min.js" type="text/javascript"></script>
    <script src="jquery-easyui-1.2.6/locale/easyui-lang-zh_CN.js" type="text/javascript"></script>
    <script src="Content/js/sysEasyUI.js" type="text/javascript"></script>
    <link href="<%= ResolveUrl("~/jquery-easyui-1.2.6/themes/"+Skin+"/easyui.css") %>"
        rel="stylesheet" type="text/css" id="easyuiTheme" />
    <link href="jquery-easyui-1.2.6/themes/icon.css" rel="stylesheet" type="text/css" />
    <script type="text/javascript">

        $(function () {
            var tilte = '<%= Title %>';
            var p = $('body').layout('panel', 'center').panel({
                title: tilte
            });
            //--加载树的权限列表
            $("#treeMenu").tree({
                animate: true,
                checkbox: false,
                url: "HanderAjax.ashx?para=treeMenu",
                cascadeCheck: false,
                //onlyLeafCheck: true,//只有子节点才有checkbox
                onBeforeExpand: function (node, param) {
                    //$('#treeMenu').tree('options').url = "HanderAjax.ashx?para=treeMenu&parentID=" + node.id; // change the url                       
                },
                expand: function (node, param) {
                    var cc = $("treeMemu")[0].outerHTML();
                },
                onSelect: function (node) {
                    AddTab(node.text, node.attributes["url"], node.iconCls);
                }
            });
        });

        function AddTab(tabText, URL, icons) {
            var src = "<iframe src=\"" + URL + "\" width=\"100%\" height=\"100%\" frameborder=\"0\" marginheight=\"0\" marginwidth=\"0\" ></iframe>";
            //var tabText = $(obj).text() + "(" + lb + ")";
            var e = $('#tt').tabs('exists', tabText);
            if (e == true) {
                $('#tt').tabs('select', tabText);
                return;
            }

            $('#tt').tabs('add', {
                title: tabText,
                //href: "Accordion.aspx",
                content: src,
                iconCls: icons,
                closable: true,
                tools: [{
                    iconCls: 'icon-mini-refresh',
                    handler: function () {

                        var tab = $('#tt').tabs('getSelected');
                        $('#tt').tabs('update', {
                            tab: tab,
                            options: {
                                //title: 'new title',
                                //iconCls: 'icon-save'
                            }
                        });
                    }
                }]
            });
        }

        function signOut() {
            $.ajax({
                type: "POST",
                async: false,
                url: "HanderAjax.ashx?para=signOut",
                success: function (data) {
                    if (data == 1) {
                        window.location.href = "Login.aspx";
                    }
                }
            });
        }

        function changeThemeFun(themeName) {
            var $easyuiTheme = $('#easyuiTheme');
            var url = $easyuiTheme.attr('href');
            var href = url.substring(0, url.indexOf('themes')) + 'themes/' + themeName + '/easyui.css';

            $easyuiTheme.attr('href', href);

            var $iframe = $('iframe');
            if ($iframe.length > 0) {
                for (var i = 0; i < $iframe.length; i++) {
                    var ifr = $iframe[i];
                    $(ifr).contents().find('#easyuiTheme').attr('href', href);
                }
            }
            $.ajax({
                type: "POST",
                url: "HanderAjax.ashx?para=UpdateSkin&Skin=" + themeName
            });
        }
        $(function () {
            bindTabEvent();
            bindTabMenuEvent();
        });

        //绑定tab的双击事件、右键事件
        function bindTabEvent() {
            $(".tabs-inner").live('dblclick', function () {
                var subtitle = $(this).children("span").text();
                if ($(this).next().is('.tabs-close')) {
                    $('#tt').tabs('close', subtitle);
                }
            });
            $(".tabs-inner").live('contextmenu', function (e) {
                $('#mm').menu('show', {
                    left: e.pageX,
                    top: e.pageY
                });
                var subtitle = $(this).children("span").text();
                $('#mm').data("currtab", subtitle);
                return false;
            });
        }
        //绑定tab右键菜单事件
        function bindTabMenuEvent() {
            //关闭当前
            $('#mm-tabclose').click(function () {
                var currtab_title = $('#mm').data("currtab");
                //if ($(this).next().is('.tabs-close')) {
                $('#tt').tabs('close', currtab_title);
                //}
            });
            //全部关闭
            $('#mm-tabcloseall').click(function () {
                $('.tabs-inner span').each(function (i, n) {
                    //if ($(this).parent().next().is('.tabs-close')) {
                    var t = $(n).text();
                    $('#tt').tabs('close', t);
                    //}
                });
            });
            //关闭除当前之外的TAB
            $('#mm-tabcloseother').click(function () {
                var currtab_title = $('#mm').data("currtab");
                $('.tabs-inner span').each(function (i, n) {
                    //if ($(this).parent().next().is('.tabs-close')) {
                    var t = $(n).text();
                    if (t != currtab_title)
                        $('#tt').tabs('close', t);
                    //}
                });
            });
            //关闭当前右侧的TAB
            $('#mm-tabcloseright').click(function () {
                var nextall = $('.tabs-selected').nextAll();
                if (nextall.length == 0) {
                    alert('已经是最后一个了');
                    return false;
                }
                nextall.each(function (i, n) {
                    if ($('a.tabs-close', $(n)).length > 0) {
                        var t = $('a:eq(0) span', $(n)).text();
                        $('#tt').tabs('close', t);
                    }
                });
                return false;
            });
            //关闭当前左侧的TAB
            $('#mm-tabcloseleft').click(function () {
                var prevall = $('.tabs-selected').prevAll();
                if (prevall.length == 0) {
                    alert('已经是第一个了');
                    return false;
                }
                prevall.each(function (i, n) {
                    if ($('a.tabs-close', $(n)).length > 0) {
                        var t = $('a:eq(0) span', $(n)).text();
                        $('#tt').tabs('close', t);
                    }
                });
                return false;
            });
        }

        function collapseAll() {
            $("#radCollapse").attr("checked", "checked");
            var node = $('#treeMenu').tree('getSelected');
            if (node) {
                $('#basetree').tree('collapseAll', node.target);
            } else {
                $('#basetree').tree('collapseAll');
            }
        } 
    </script>
    <style type="text/css">
        .topdiv
        {
            height: 60px;
            padding: 0px;
            background-color: #D8E4FE;
        }
    </style>
</head>
<body class="easyui-layout">
    <div region="north" border="false" class="topdiv" valign="bottom">
        <table width="100%" height="50%">
            <tr>
                <td valign="bottom" align="left">
                    <!--新菜单-->
                    <div style=" padding: 5px; width: 600px;" runat="server" id="div1">
                        <%--<a href="javascript:void(0)" id="mb1" class="easyui-menubutton" menu="#mm1" iconcls="icon-edit">
                            Edit</a> <a href="javascript:void(0)" id="mb2" class="easyui-menubutton" menu="#mm2"
                                iconcls="icon-help">Help</a>
                                <a href="javascript:AddTab('微信会员卡','MembershipCard/CardList.aspx','icon-ok')" id="mb5" 
                                iconcls="icon-help">Help</a>--%>
                    </div>
                     <asp:Label ID="lblMenu2" runat="server" Text=""></asp:Label>
                    <%--<div id="mm1" style="width: 150px;">
                        <div iconcls="icon-undo">
                            Undo</div>
                        <div iconcls="icon-redo">
                            Redo</div>
                        <div class="menu-sep">
                        </div>
                        <div>
                            Cut</div>
                        <div>
                            Copy</div>
                        <div>
                            Paste</div>
                        <div class="menu-sep">
                        </div>
                        <div>
                            <span>Toolbar</span>
                            <div style="width: 150px;">
                                <div onclick="AddTab('微信会员卡','MembershipCard/CardList.aspx','icon-ok')">
                                    Address</div>
                                <div>
                                    Link</div>
                                <div>
                                    Navigation Toolbar</div>
                                <div>
                                    Bookmark Toolbar</div>
                                <div class="menu-sep">
                                </div>
                                <div>
                                    New Toolbar...</div>
                            </div>
                        </div>
                        <div iconcls="icon-remove">
                            Delete</div>
                        <div>
                            Select All</div>
                    </div>
                    <div id="mm2" style="width: 100px;">
                        <div>
                            Help</div>
                        <div>
                            Update</div>
                        <div>
                            About</div>
                    </div>--%>
                    <!--新菜单-->
                    <%--<div style="float: left; bottom: 0px;  padding-top:20px; width: 200px;">
                        <a id="mb1" class="easyui-menubutton" menu="#mm1" iconcls="icon-wx">微信</a>|<a
                            id="mb2" class="easyui-menubutton" iconcls="icon-back" menu="#mm2"> 注销</a>
                    </div>--%>
                </td>
                <td valign="top" align="right">
                    <div style="float: right; bottom: 0px; padding: 0px; width: 200px;">
                        <a id="mb3" class="easyui-menubutton" menu="#mm3" iconcls="icon-help">控制面板</a>|<a
                            id="mb4" class="easyui-menubutton" iconcls="icon-back" menu="#mm4"> 注销</a>
                    </div>
                </td>
            </tr>
        </table>
        <%-- <div id="mm1" style="width: 100px;">
            <div iconcls="icon-add" onclick="AddTab('微信会员卡','MembershipCard/CardList.aspx','icon-ok')">
                微信会员卡</div>
           <div iconcls="icon-ok" onclick="openWindow('UserInfo/EditUserInfo.aspx?para=CurrentUser&option=update')">
                微信团购</div>
                <div iconcls="icon-help" onclick="openWindow('UserInfo/EditUserInfo.aspx?para=CurrentUser&option=update')">
                消息管理</div>
            </div>--%>
    </div>
    <%-- <div id="mm2" style="width: 100px;">
            <div iconcls="icon-pencil" onclick="openWindow('UserInfo/EditUserInfo.aspx?para=CurrentUser&option=update')">
                个人信息</div>
            <div onclick="signOut()">
                <a>注销</a>
            </div>
        </div>--%>
    <div id="mm3" style="width: 100px;">
        <div iconcls="icon-pencil" onclick="openWindow('UserInfo/EditUserInfo.aspx?para=CurrentUser&option=update')">
            个人信息</div>
        <div>
            <span>更换主题</span>
            <div style="width: 150px;">
                <div onclick="changeThemeFun('Cupertino')">
                    Cupertino</div>
                <div onclick="changeThemeFun('Dark-Hive')">
                    Dark-Hive</div>
                <div onclick="changeThemeFun('Default')">
                    Defaul</div>
                <div onclick="changeThemeFun('Gray')">
                    Gray</div>
                <div onclick="changeThemeFun('Pepper-Grinder')">
                    Pepper-Grinder</div>
                <div onclick="changeThemeFun('Sunny')">
                    Sunny</div>
            </div>
        </div>
    </div>
    <div id="mm4" style="width: 100px;">
        <div iconcls="icon-pencil" onclick="openWindow('UserInfo/EditUserInfo.aspx?para=CurrentUser&option=update')">
            个人信息</div>
        <div onclick="signOut()">
            <a>注销</a>
        </div>
    </div>
    <div region="west" split="false" title="Herborist" style="width: 180px; font-size: 25px"
        iconcls="icon-tip">
        <div class="easyui-accordion" fit="true" border="false">
            <div style="padding: 1px; overflow: auto;" selected="true">
                <ul id="treeMenu" style="width: 100%">
                </ul>
            </div>
        </div>
    </div>
    <div region="center" title="center title" style="padding: 0px; background: #eee;">
        <div class="easyui-tabs" fit="true" border="false" id="tt">
        </div>
    </div>
    <div id="mm" class="easyui-menu" style="width: 150px;">
        <div id="mm-tabclose">
            关闭</div>
        <div id="mm-tabcloseall">
            关闭全部</div>
        <div id="mm-tabcloseother">
            关闭其他</div>
        <div class="menu-sep">
        </div>
        <div id="mm-tabcloseright">
            关闭右侧标签</div>
        <div id="mm-tabcloseleft">
            关闭左侧标签</div>
    </div>
</body>
</html>
